<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>有饭狮</title>
	<style type="text/css">
    html,body{
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
    }
    .main{
        height: 100%;
        position: relative;
    }
	.left{
        width: 300px;
        height: 100%;
        position: absolute;
    }
    .left .logo{
        height: 100px;
		line-height: 100px;
		text-align: center;
    }
	.left .logo img{
        vertical-align: middle;
    }
    .left .nav{
        height: 200px;
    }
    .left .welcome{
        height: 200px;
        margin-top: 10px;
    }
	.left .welcome img{
        width: 200px;
    }
    .right{
        margin-left: 300px;
        position: relative;
        text-align: center;
    }
    .right .banner{
        height: 300px;
		position: relative;
    }
	.right .banner img{
        position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		max-width: 95%;
		max-height: 95%;
    }
    .right .items{
        margin-top: 10px;
    }
    .right .item{
        width: 33.33%;
        height: 200px;
        float: left;
		padding: 10px;
		box-sizing: border-box;
		position: relative;
    }
	.right .item img{
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		max-width: 95%;
		max-height: 95%;
    }
	</style>
</head>
<body>
	<div class="main">
        <div class="left">
            <!-- <div class="logo"><img src="http://iph.href.lu/300x100?text=logo&fg=0099FF&bg=fff"></div> -->
            <div class="logo"><img src="images/1f40c.png"></div>
            <div class="nav">
				<ul>
					<li>1. xxx</li>
					<li>2. xxx</li>
					<li>3. xxx</li>
					<li>4. xxx</li>
				</ul>
			</div>
            <div class="welcome">
				<img src="https://qr.api.cli.im/qr?data=YOUFANSHI&level=H&transparent=false&bgcolor=%23ffffff&forecolor=%230099ff&blockpixel=12&marginblock=1&logourl=http%3A&size=200&kid=cliim&key=30a4fe77360f5835f26d009f7a6e8375">
			</div>
        </div>
        <div class="right">
            <div class="banner"><img src="http://iph.href.lu/1000x300?text=banner&fg=fff&bg=0099FF"></div>
            <div class="items">
                <div class="item"><img src="images/Aerial01.jpg"></div>
                <div class="item"><img src="images/Aerial02.jpg"></div>
                <div class="item"><img src="images/Aerial03.jpg"></div>
                <div class="item"><img src="images/Aerial04.jpg"></div>
                <div class="item"><img src="images/Aerial05.jpg"></div>
                <div class="item"><img src="images/Aerial06.jpg"></div>
                <div class="item"><img src="images/Aerial07.jpg"></div>
                <div class="item"><img src="images/Aerial08.jpg"></div>
                <div class="item"><img src="images/Aerial09.jpg"></div>
            </div>
        </div>   
    </div>
</body>
</html>